<template>
  <div class="qf-cate-select">
    <el-select
      style="width: 100%"
      clearable
      v-model="cate"
      @change="handleCate"
    >
      <el-option value="">全部</el-option>
      <el-option
        v-for="item in cateArr"
        :key="item.id"
        :label="item.cate_zh"
        :value="item.cate"
      >
      </el-option>
    </el-select>
  </div>
</template>

<script>
import { mapMutations } from "vuex";
export default {
  data() {
    return {
      cateArr: [],
      cate: "",
    };
  },
  methods: {
    ...mapMutations("good", ["updateGoodCates"]),
    emitInput(val) {
      this.$emit("input", val);
    },
    handleCate() {
      this.emitInput(this.cate);
    },
  },
  async mounted() {
    const res = await this.$api.fetchAllCate();
    this.cateArr = res.list;
    this.updateGoodCates(res.list);
  },
};
</script>

<style lang="scss" scoped>
.qf-cate-select {
  display: inline-block;
}
</style>
